{extend name="index_layout"/}
{block name="main"}
<form class="layui-form" method="post">
    <div class="layui-form-item">
        <label class="layui-form-label"><span class="bitian">*</span>入库类型 </label>
        <div class="layui-input-block">
            <select name="type" id="type">
                <option value="1">普通入库</option>
                <option value="2">采购入库</option>
                <option value="3">成品入库</option>
                <option value="4">调拨入库</option>
                <option value="5">销售退货入库</option>
                <option value="6">其它入库</option>
            </select>
        </div>
    </div>
    <div class="layui-form-item">
        <label class="layui-form-label"><span class="bitian">*</span>入库时间 </label>
        <div class="layui-input-block">
            <input type="text" name="create_time" id="test1" lay-verify="required" autocomplete="off" placeholder="选择入库时间" class="layui-input">
        </div>
    </div>
    <div class="layui-form-item">
        <label class="layui-form-label"><span class="bitian">*</span>备注 </label>
        <div class="layui-input-block">
            <textarea name="bz" id="bz"></textarea>
        </div>
    </div>
    <hr>
     
    <span style="margin-left: 5%;">入库明细</span>
    <button class="layui-btn layui-btn-xs add-product" type="button" style="float:right;margin-right: 5%;">添加产品</button>
    <table class="layui-table" id="rkList" style="margin:10px auto;width:90%;">
        <thead>
            <tr>
                <th>序号</th>
                <th>产品编号</th>
                <th>产品名称</th>
                <th>产品规格</th>
                <th>库存单位</th>
                <th>当前库存数量</th>
                <th>入库数量</th>
                <th>操作</th>
            </tr>
        </thead>
        <tbody>
        
        </tbody>
    </table>
    <div class="layui-form-item layer-footer">
        <div class="layui-input-block">
            <button class="layui-btn" lay-submit="" lay-filter='ds' type="button" data-refresh="false">立即提交</button>
            <button class="layui-btn layui-btn-normal" type="button" onclick="var index1 = parent.layer.getFrameIndex(window.name);
            parent.layer.close(index1);">返回</button>
        </div>
    </div>

</form>
<style>
    .layui-layer-content{
        overflow:hidden;
    }
</style>

{/block}
{block name="script"}
<script>
    layui.use(['form','jquery','laydate','layedit'], function() {
        var form = layui.form;
        var $ = layui.jquery;
        var laydate = layui.laydate;
        var layedit = layui.layedit;
        laydate.render({
            elem: '#test1', //指定元素
            type:"datetime"
        });
        var bzindex = layedit.build('bz');
        var index2 = 0;
        var rukuList = [];
        var productList = JSON.parse('{:json_encode($productList)}');
        $('.add-product').on('click',function(){
            var _html = '<form style="margin-top:2em" class="layui-form" method="post">'+
                '<div class="layui-form-item">'+
                    '<label class="layui-form-label"><span class="bitian">*</span>产品 </label>'+
                    '<div class="layui-input-block">'+
                        '<select name="productId" id="productId" lay-filter="detail">'+
                            '<option value="0">请选择</option>';
                            for(var i in productList){
                                _html += '<option value="'+productList[i].id+'">'+productList[i].title+'</option>';
                            }
                _html +='</select>'+
                    '</div>'+
                '</div>'+
                '<div class="layui-form-item">'+
                    '<label class="layui-form-label">当前库存 </label>'+
                    '<div class="layui-input-block">'+
                        '<span style="line-height: 36px;" class="stock"></span>'+
                    '</div>'+
                '</div>'+
                '<div class="layui-form-item">'+
                    '<label class="layui-form-label"><span class="bitian">*</span>数量 </label>'+
                    '<div class="layui-input-block">'+
                        '<input type="number" name="nums" lay-verify="required" autocomplete="off" placeholder="数量" class="layui-input">'+
                    '</div>'+
                '</div>'+
                ''+
                    '<div class="layui-input-block">'+
                        '<button class="layui-btn" lay-submit="" lay-filter="ds2" type="button" data-refresh="false">立即提交</button>'+
                        '<button class="layui-btn layui-btn-normal fanhui" type="button">返回</button>'+
                    '</div>'+
                ''+
            '</form>';
            layer.open({
                type: 1, 
                area: ['600px', '300px'],
                content: _html, //这里content是一个普通的String
                success:function(index,layero){
                    form.render('select');
                    index2 = layero;
                },
                end:function(){
                    rkList();
                }
            });
        })
        form.on('select(detail)',function(data){
            var stock = 0;
            for(var i in productList){
                if(productList[i].id == data.value){
                    stock = productList[i].stock;
                }
            }
            $('.stock').html(stock);
        })
        $('body').on('click','.edit-detail',function(){
            var key = $(this).parent().attr('key');
            var productList = JSON.parse('{:json_encode($productList)}');
            var _html = '<form style="margin-top:2em" class="layui-form" method="post">'+
                '<div class="layui-form-item">'+
                    '<label class="layui-form-label"><span class="bitian">*</span>产品 </label>'+
                    '<div class="layui-input-block">'+
                        '<select name="productId" id="productId" lay-filter="detail">'+
                            '<option value="0">请选择</option>';
                            for(var i in productList){
                                if(key == i){
                                    _html += '<option selected value="'+productList[i].id+'">'+productList[i].title+'</option>';
                                }else{
                                    _html += '<option value="'+productList[i].id+'">'+productList[i].title+'</option>';
                                }
                            }
                _html +='</select>'+
                    '</div>'+
                '</div>'+
                '<div class="layui-form-item">'+
                    '<label class="layui-form-label">当前库存 </label>'+
                    '<div class="layui-input-block">'+
                        '<span style="line-height: 36px;" class="stock">'+productList[key].stock+'</span>'+
                    '</div>'+
                '</div>'+
                '<div class="layui-form-item">'+
                    '<label class="layui-form-label"><span class="bitian">*</span>数量 </label>'+
                    '<div class="layui-input-block">'+
                        '<input type="number" name="nums" value="'+rukuList[key].count+'" lay-verify="required" autocomplete="off" placeholder="数量" class="layui-input">'+
                    '</div>'+
                        '<input type="hidden" name="key" value="'+key+'" class="layui-input">'+
                '</div>'+
                ''+
                    '<div class="layui-input-block">'+
                        '<button class="layui-btn" lay-submit="" lay-filter="ds3" type="button" data-refresh="false">立即提交</button>'+
                        '<button class="layui-btn layui-btn-normal fanhui" type="button">返回</button>'+
                    '</div>'+
                ''+
            '</form>';
            layer.open({
                type: 1, 
                area: ['600px', '300px'],
                content: _html, //这里content是一个普通的String
                success:function(index,layero){
                    form.render('select');
                    index2 = layero;
                },
                end:function(){
                    rkList();
                }
            })
        })
        $('body').on('click','.del-detail',function(){
            layer.confirm('您确定要删除吗?',function(index){
                layer.msg('删除成功');
                var key = $(this).parent().attr('key');
                rukuList.splice(key, 1);
                rkList();
                layer.close(index);
            })
        })
        $('body').on('click','.fanhui',function(){
            layer.close(index2);
        })
        function rkList()
        {
            var _html2 = '';
            if(rukuList.length > 0){
                for(var i in rukuList){
                    _html2 += '<tr>';
                    _html2 += '<td>'+(parseInt(i)+1)+'</td>';
                    _html2 += '<td>'+rukuList[i].nums+'</td>';
                    _html2 += '<td>'+rukuList[i].title+'</td>';
                    _html2 += '<td>'+rukuList[i].guige+'</td>';
                    _html2 += '<td>'+rukuList[i].danwei+'</td>';
                    _html2 += '<td>'+rukuList[i].stock+'</td>';
                    _html2 += '<td>'+rukuList[i].count+'</td>';
                    _html2 += '<td key="'+i+'"><input type="hidden" name="pid[]" value="'+rukuList[i].id+'"><input type="hidden" name="counts[]" value="'+rukuList[i].count+'"><button type="button" class="layui-btn layui-btn-xs edit-detail">编辑</button><button type="button" class="layui-btn layui-btn-xs layui-btn-danger del-detail">删除</button></td>';
                    _html2 += '</tr>';
                }
            }
            $('#rkList').find('tbody').html(_html2);
        }
        form.on('submit(ds2)',function(data){
            var productId = data.field.productId;
            $.post('{:url("getProDetail")}?id='+productId,function(res){
                var product = res.product;
                product.count = data.field.nums;
                rukuList.push(product);
                layer.msg('添加成功');
                setTimeout(() => {
                    layer.close(index2);
                }, 500);
            },'json')
        })
        form.on('submit(ds3)',function(data){
            var productId = data.field.productId;
            var key = data.field.key;
            $.post('{:url("getProDetail")}?id='+productId,function(res){
                var product = res.product;
                product.count = data.field.nums;
                rukuList[key] = product;
                layer.msg('添加成功');
                setTimeout(() => {
                    layer.close(index2);
                }, 500);
            },'json')
        })
        form.on('submit(ds)',function(data){
            var param = data.field;
            param.bz = layedit.getContent(bzindex);
            $.post('{:url("editPost")}',param,function(res){
                if(res.code > 0){
                    layer.msg('添加成功');
                    setTimeout(() => {
                        var index1 = parent.layer.getFrameIndex(window.name); //先得到当前iframe层的索引
                        parent.layer.close(index1);
                        parent.location.reload();
                    }, 500);
                }else{
                    layer.msg(res.msg);
                }
            },'json');
        });
    });
</script>
{/block}